import React from "react";
// 组件
import MainLayout from "@component/mainLayout/mainLayout";
import Button from "@component/button/index";

import yhTools from "@tools/yh";

import "./errorBoundary.scss";

import errorIcon from "@images/error_icon.png";

/**内容加载异常页面 */
class ErrorBoundary extends React.Component {
	constructor(props) {
		super(props);
		this.state = { hasError: false };
	}

	static getDerivedStateFromError(error) {
		return { hasError: true };
	}

	componentDidCatch(error, errorInfo) {}
	clickBtn = () => {
		yhTools.closePage();
	};
	render() {
		const _pageParams = {
			header: {
				title: "页面加载失败",
				goToApp: true
			},
			history: this.props.history,
			cacheLifecycles: this.props.cacheLifecycles
		};
		if (this.state.hasError) {
			return (
				<MainLayout pageParams={_pageParams}>
					<div className="error-content">
						<div className="error-box">
							　<img src={errorIcon} />
							<p>页面加载失败</p>
						</div>
						<div className="error_flooer-box">
							<Button className="button" onClick={this.clickBtn}>
								退出
							</Button>
						</div>
					</div>
				</MainLayout>
			);
		}
		return this.props.children;
	}
}
export default ErrorBoundary;
